<script setup>
import { ref, onMounted } from 'vue'
import { editCheckItem, addCheckItem } from '@/api/checkItem'
import { getCheckTypeList } from '@/api/checkType'
import { ElMessage } from 'element-plus'

const dialogVisible = ref(false)
const emits = defineEmits(['query'])
const checkTypeOptions = ref([])
const loading = ref(false) 

const formData = ref({
  id: null,
    name: null,
    checkTypeId: null, 
    method: null,      
    standardValue: null, 
    unit: null,        
    max: null,         
    min: null,        
    description: null 
})

const loadCheckTypeList = async () => {
  if (loading.value) return
  loading.value = true
  try {
    const result = await getCheckTypeList()
    if (result && result.code === 200) { 
      checkTypeOptions.value = result.data || []
    } else {
      ElMessage.error('检验类型接口返回错误')
    }
  } catch (error) {
    console.error('检验类型加载失败：', error)
    ElMessage.error('获取检验类型失败')
  } finally {
    loading.value = false
  }
}

const save = async() => {
  if (!formData.value.name) {
    ElMessage.warning('请输入名称')
    return
  }
  if (!formData.value.checkTypeId) {
    ElMessage.warning('请选择检验类型')
    return
  }
  if (!formData.value.method) {
    ElMessage.warning('请输入作业方式')
    return
  }
  if (formData.value.standardValue === null || formData.value.standardValue === '') {
    ElMessage.warning('请输入标准值')
    return
  }
  if (!formData.value.unit) {
    ElMessage.warning('请输入单位')
    return
  }
  if (formData.value.max  === null || formData.value.max  === '') {
    ElMessage.warning('请输入上限值')
    return
  }
  if (formData.value.min  === null || formData.value.min  === '') {
    ElMessage.warning('请输入下限值')
    return
  }

  try {
    loading.value = true
    if (formData.value.id) {
      await editCheckItem(formData.value)
      ElMessage.success('修改成功！')
    } else {
      await addCheckItem(formData.value)
      ElMessage.success('新增成功！')
    }
    dialogVisible.value = false
    emits('query')
    formData.value = {
    id: null,
    name: null,
    checkTypeId: null, 
    method: null,      
    standardValue: null, 
    unit: null,        
    max: null,         
    min: null,        
    description: null 
    }
  } catch (error) {
    ElMessage.error('操作失败：' + (error.message || '网络错误'))
  } finally {
    loading.value = false
  }
}

const handleClose = () => {
  formData.value = {
    id: null,
    name: null,
    checkTypeId: null,
    method: null,
    standardValue: null,
    unit: null,
    max: null,
    min: null,
    description: null
  }
  dialogVisible.value = false
}

onMounted(() => {
  loadCheckTypeList()
})

defineExpose({
  formData,
  dialogVisible,
  loadCheckTypeList
})
</script>

<template>
  <el-dialog
    v-model="dialogVisible"
    :title="formData.id ? '编辑检验项目' : '新增检验项目'"
    width="500"
    :before-close="handleClose"
  >
    <el-form 
      :model="formData" 
      label-width="100px" 
      style="max-width: 600px"
      v-loading="loading"
    >
      <el-form-item label="名称" required>
        <el-input v-model="formData.name" placeholder="请输入名称" />
      </el-form-item>
      
      <el-form-item label="检验类型" required>
        <el-select 
          v-model="formData.checkTypeId" 
          placeholder="请选择检验类型"
          clearable
        >
          <el-option 
            v-for="type in checkTypeOptions" 
            :key="type.id" 
            :label="type.name"  
            :value="type.id"   
          />
        </el-select>
      </el-form-item>
      
      <el-form-item label="作业方式" required>
        <el-input v-model="formData.method" placeholder="请输入作业方式" />
      </el-form-item>
      
      <el-form-item label="标准值" required>
        <el-input v-model="formData.standardValue" placeholder="请输入标准值" />
      </el-form-item>
      
      <el-form-item label="单位" required>
        <el-input v-model="formData.unit" placeholder="请输入单位" />
      </el-form-item>
      
      <el-form-item label="上限值" required>
        <el-input v-model="formData.max" placeholder="请输入上限值" />
      </el-form-item>
      
      <el-form-item label="下限值" required>
        <el-input v-model="formData.min" placeholder="请输入下限值" />
      </el-form-item>
      
      <el-form-item label="备注">
        <el-input
          v-model="formData.description"
          placeholder="请输入备注"
          type="textarea"
          rows="3"
        />
      </el-form-item>
      
      <el-form-item>
        <el-button type="primary" @click="save">保存</el-button>
        <el-button @click="handleClose">取消</el-button>
      </el-form-item>
    </el-form>
  </el-dialog>
</template>